﻿<?xml version="1.0" encoding="UTF-8"?>
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
        xmlns:h="http://java.sun.com/jsf/html"
        xmlns:f="http://java.sun.com/jsf/core"
        xmlns:cc="http://java.sun.com/jsf/composite"
        xmlns:ui="http://java.sun.com/jsf/facelets">

<cc:interface>
    <cc:attribute name="value" required="true" type="java.lang.Integer"/>
    <cc:attribute name="inc" required="false" default="1"/>
    <cc:editableValueHolder name="input"/>
</cc:interface>

<cc:implementation>
    <h:outputStylesheet library="mygourmet" name="components.css"/>
    <h:outputScript library="mygourmet" name="inputSpinner.js" target="head"/>
    <h:panelGroup>
        <h:inputText id="input" value="#{cc.attrs.value}" styleClass="inputSpinner-input">
            <f:converter converterId="javax.faces.Integer"/>
        </h:inputText>
        <h:panelGroup id="buttons" styleClass="inputSpinner-buttons">
            <h:graphicImage library="mygourmet" name="spin-up.png" styleClass="inputSpinner-button"
                    onclick="return changeNumber('#{cc.clientId}:input', #{cc.attrs.inc});"/>
            <h:graphicImage library="mygourmet" name="spin-down.png" styleClass="inputSpinner-button"
                    onclick="return changeNumber('#{cc.clientId}:input', #{-cc.attrs.inc});"/>
        </h:panelGroup>
    </h:panelGroup>
</cc:implementation>

</ui:composition>